<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>AdminLTE | moreMessage</title>
		<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
		<!-- bootstrap 3.0.2 -->
		<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css" />
		<!-- font Awesome -->
		<link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
		<!-- Ionicons -->
		<link href="../css/ionicons.min.css" rel="stylesheet" type="text/css" />
		<!-- Theme style -->
		<link href="../css/AdminLTE.css" rel="stylesheet" type="text/css" />

		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->
		<style type="text/css">
			input {
				padding: 5px;
			}
			.address {
				margin-top: 5px;
				width: 100%;
				border: 1px solid black;
			}
			.remark {
				min-height: 100px;
				padding: 0;
			}
			.style{
				border: 1px solid black; 
				min-height: 70px;
				padding: 10px;
			}
			.style div{
				border: 1px solid black; 
				margin-right: 5px;
				padding: 5px;
				float: left;
			}
			.style div span{
				margin-left: 5px;
			}
			.image-content{
				width: 60px;
				height: 60px;
				border: 1px solid black;
				float: left;
				margin-right: 10px;
			}
			.moreMessage input{
				border: 1px solid black;
			}
			.moreMessage .special input{
				width: 100%;
			}
			.row{
				margin: 0 20px;
			}
		</style>
	</head>

	<body class="skin-blue">
		<!-- header logo: style can be found in header.less -->
		<#include "../../header.html"/>
		<div class="wrapper row-offcanvas row-offcanvas-left">
			<!-- Left side column. contains the logo and sidebar -->
			<#include "../../menu.html"/>

			<!-- Right side column. Contains the navbar and content of the page -->
			<aside class="right-side">
				<section class="content-header">
                    <h1>更多客户信息</h1>
                </section>
				<!-- Main content -->
				<section class="content">
					<div class="row">
						<div class="col-md-12">
							<div>
								<span style="font-weight: bold; font-size: 20px;">新增客户</span>
								<span style="float: right;">
                        			<a href="#">客户管理</a>
                        			<i>&gt;</i>
                        			<a href="#">新增客户</a>
                        		</span>
								<div class="clear" style="clear: both;"></div>
							</div>
							<div style="margin-bottom: 10px;">
								<div style="float:left; margin-right: 10px; width: 7px; height: 20px; background: #3882ff; "></div>
								<div>填写客户基本信息</div>
							</div>
							<div class="custorm-content">
								<table class="table table-bordered">
									<tr>
										<td>
											<span style="color: red;">*</span> 客户名
										</td>
										<td>
											<input type="text" id="fullname"/>
											<!-- <select>
												<option value="杭州小黑裙服装有限公司">杭州小黑裙服装有限公司</option>
												<option value="杭州小黑裙服装有限公司">杭州小黑裙服装有限公司</option>
												<option value="杭州小黑裙服装有限公司">杭州小黑裙服装有限公司</option>
											</select> -->
										</td>
										<td>简称</td>
										<td>
											<input type="text" id="abbreviation"/>
											<!-- <select>
												<option value="小黑裙服装">小黑裙服装</option>
												<option value="小黑裙服装">小黑裙服装</option>
												<option value="小黑裙服装">小黑裙服装</option>
											</select> -->
										</td>
									</tr>
									<tr>
										<td>
											<span style="color: red;">*</span> 客户分类
										</td>
										<td>
											<select id="category">
												<option value="001">淘卖</option>
												<option value="002">品牌</option>
												<option value="003">网红</option>
											</select>
										</td>
										<td>
											<span style="color: red;">*</span> 等级
										</td>
										<td>
											<select id="level">
												<option value="001">V1</option>
												<option value="002">V2</option>
												<option value="003">V3</option>
											</select>
										</td>
									</tr>
									<tr>
										<td>联系人</td>
										<td colspan="3">
											<div>
												<div style="border: 1px solid black; float: left; margin-right: 5px;">
													<span style="color: red;">*</span> 姓名：
													<input style="border: none;" type="text" placeholder="请输入姓名" />
												</div>
												<div style="border: 1px solid black; float: left; margin-right: 5px;">
													<span style="color: red;">*</span> 手机号：
													<input style="border: none;" type="text" id="" placeholder="请输入手机号" />
												</div>
												<div style="border: 1px solid black; float: left; margin-right: 5px;">
													<span style="color: red;">*</span> 邮箱：
													<input style="border: none;" type="text" placeholder="请输入邮箱" />
												</div>
												<div style="border: 1px solid black; float: left; margin-right: 5px;">
													职位/部门：
													<input style="border: none;" type="text" />
												</div>
												<div class="clear" style="clear: both;"></div>
											</div>
											<div class="addLink col-md-2" style=" margin-top: 5px; color: #3882FF; border: 1px solid #3882FF;">
												+添加多个联系人
											</div>
										</td>
									</tr>
									<tr>
										<td>公司地址</td>
										<td colspan="3">
											<div>
												<div style="float: left; margin-right: 5px;">
													<select id="provinceId">
														<option value="">请选择</option>
													</select>
												</div>
												<div style="float: left; margin-right: 5px;">
													<select id="cityId">
														<option value="">请选择</option>
													</select>
												</div>
												<div style="float: left;">
													<select id="areaId">
														<option value="">请选择</option>
													</select>
												</div>
												<div class="clear" style="clear: both;"></div>
											</div>
											<div>
												<input class="address" type="text" id="detailAddress" placeholder="填写详细地址" />
											</div>
										</td>
									</tr>
									<tr>
										<td>收货地址</td>
										<td colspan="3">
											<input class="address" type="text" id="deliveryAddress" placeholder="默认公司地址" />
										</td>
									</tr>
									<tr>
										<td>网址</td>
										<td colspan="3">
											<input class="address" type="text" id="web" placeholder="http://www." />
										</td>
									</tr>
									<tr>
										<td>标签</td>
										<td colspan="3">
											<input class="address-content" type="text" id="label" />
										</td>
									</tr>
									<tr>
										<td>备注</td>
										<td colspan="3">
											<input class="address remark" type="text" id="memo" placeholder="可填写最近状态、所需支持" />
										</td>
									</tr>
									<tr></tr>
								</table>
							</div>

						</div>
						<!-- /.box -->

					</div>
				</section><!-- /.col -->
				
				<section class="content">
					<div class="row">
						<div class="col-md-12 moreMessage">
							<div style="margin-bottom: 10px;">
								<div style="float:left; margin-right: 10px; width: 7px; height: 20px; background: #3882ff; "></div>
								<div>填写更多完整信息</div>
							</div>
							<div class="custorm-content">
								<table class="table table-bordered">
									<tr>
										<td class="col-md-1">产品分类</td>
										<td>
											<input type="text" class="address-content" id="productCategory"/>
											<!-- <select>
												<option value="女装">女装</option>
												<option value="男装">男装</option>
											</select> -->
										</td>
									</tr>
									<tr>
										<td>风格标签</td>
										<td>
											<input type="text" class="address-content" id="styleLabel"/>
											<!-- <div class="style">
												
												<div>玉女<span>X</span></div>
												<div>玉女<span>X</span></div>
												<div class="clear" style="clear: both; border: none;"></div>
											</div> -->
										</td>
									</tr>
									<tr>
										<td>附件</td>
										<td class="image">
											<div class="image-content"></div>
											<div>
												<input type="file" name="attach"/>
											   <!-- <button type="submit">点击上传附件</button> -->
											   <div>
											   	附件仅支持jpg、png、bmp、rar、zip格式
											   </div>
											</div>
											<div class="clear" style="clear: both;"></div>
										</td>
									</tr>
									<tr>
										<td>目标人群</td>
										<td class="special">
											<input type="text" id="targetConsumer"/>
										</td>
									</tr>
									<tr>
										<td>销售渠道</td>
										<td class="special">
											<input type="text" id="saleChannel"/>
										</td>
									</tr>
									<tr>
										<td>预计年销售额</td>
										<td>
											<input type="text" id="saleAmount"/>
										</td>
									</tr>
									<tr>
										<td>上新频率</td>
										<td>
											<input type="text" id="updateFrequency"/>
											每n周/月
										</td>
									</tr>
									<tr>
										<td>上新数量</td>
										<td>
											<input type="text" id="updateCount"/>
											件
										</td>
									</tr>
								</table>
							</div>
							<div style="margin-left: 10%;">
								<button type="button" id="add" class="btn btn-primary" style="margin-right: 10px;">确定新增</button>
								<button type="button" class="btn btn-default">放弃新增</button>
							</div>
						</div>
						<!-- /.box -->

					</div>
				</section><!-- /.col -->
				
				
			</aside>
		</div>
		<!-- /.row -->

		
		<!-- /.content -->
		
		<!-- /.right-side -->
		</div>
		<!-- ./wrapper -->

		<!-- jQuery 2.0.2 -->
		<script src="../js/jquery.min.js"></script>
		<!-- Bootstrap -->
		<script src="../js/bootstrap.min.js" type="text/javascript"></script>
		<!-- AdminLTE App -->
		<script src="../js/AdminLTE/app.js" type="text/javascript"></script>
		<!-- AdminLTE for demo purposes -->
		<script src="../js/customer/customer.js" type="text/javascript"></script>
	</body>
	<script>
		doReadArea(1,'provinceId');
	</script>
</html>